<template>
	<view class="order-menus">
		<view v-for="(item, index) in list" :key="index" class="item-wrap">
			<view class="item row">
				<view class="menus-img">
					<custom-image width="180rpx" radius="10rpx" height="180rpx" lazy-load :src="item.mealPic">
					</custom-image>
				</view>
				<view class="menus-info ml20 flex1">
					<view class="menus-name mb10">
						<text class="line1">{{item.mealName}}</text>
					</view>
					<view class="menus-spec xs muted mb20 line2">{{item.mealDescribe}}</view>
					<view class="row-between">
						<view class="menus-price row">
							<view class="primary">
								<price-format v-if="item.is_show_member" :weight="500" :subscript-size="32"
									:first-size="32" :second-size="32" :price="item.market_price"></price-format>
								<price-format v-else :weight="600" :subscript-size="32" :first-size="32"
									:second-size="32" :price="item.actualAmount"></price-format>
							</view>
						</view>
						<view class="menus-num sm ">数量：{{item.quantity}}份</view>
					</view>
				</view>
			</view>
			<!-- <view class="menus-footer row" v-if="link && item.comment_btn || item.refund_btn">
				<view style="flex: 1"></view>
				<navigator class="mr20" hover-class="none"
					:url="'/pages/bundle/menus_reviews/menus_reviews?id=' + item.id" v-if="item.comment_btn">
					<button size="xs" class="plain br60" hover-class="none">
						评价晒图
					</button>
				</navigator>
				<navigator v-if="item.refund_btn" hover-class="none"
					:url="'/pages/bundle/apply_refund/apply_refund?order_id=' + item.order_id + '&item_id=' + item.item_id">
					<button size="xs" class="plain br60" hover-class="none">
						申请退款
					</button>
				</navigator>
			</view> -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {};
		},
		components: {},
		props: {
			list: {
				type: Array,
				default: () => []
			},
			orderType: {
				type: String
			},
			link: {
				type: Boolean,
				default: false
			},
			team: {
				type: [Object, Array],
				default: () => ({})
			}
		},


		methods: {}
	};
</script>
<style lang="scss">
	.order-menus {

		// height: 460rpx;
		// overflow: hidden;
		.item {
			padding: 0 24rpx;

			font-family: PingFangSC-Semibold, PingFang SC;

			.menus-info {
				flex: 1;
				overflow: hidden;
				.menus-name {
					display: flex;
					justify-content: space-between;
					width: 100%;
					font-size: 28rpx;
					font-weight: 600;
					color: #1E1E1E;
					line-height: 40rpx;

					.line1 {
						flex: 1
					}
				}
				.menu-spec {
					font-size: 20rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #727272;
					line-height: 28rpx;
				}
				.menus-price {
					font-size: 32rpx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: 600;
					color: #FF6600;
					line-height: 44rpx;
				}
				.menus-num {
					font-size: 24rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #727272;
					line-height: 34rpx;
				}
			}

			.vip-price {
				margin: 0 10rpx;
				background-color: #FFE9BA;
				line-height: 30rpx;
				border-radius: 6rpx;
				overflow: hidden;

				.price-name {
					background-color: #101010;
					padding: 3rpx 10rpx;
					color: #FFD4B7;
					position: relative;
					overflow: hidden;

					&::after {
						content: '';
						display: block;
						width: 20rpx;
						height: 20rpx;
						position: absolute;
						right: -15rpx;
						background-color: #FFE9BA;
						border-radius: 50%;
						top: 50%;
						transform: translateY(-50%);
						box-sizing: border-box;
					}
				}
			}
		}

		.menus-footer {
			height: 70rpx;
			align-items: flex-start;
			padding: 0 24rpx;

			.plain {
				border: 1px solid #999;
				height: 52rpx;
				line-height: 52rpx;
				font-size: 26rpx;
			}
		}
	}
</style>
